<template>
	<view>
		<view class="delivery " v-for="(i,index) in orderlist" >
			<view class="orderitem u-font-36" style="font-weight: bold;">
				<text></text>
				
				<!-- <text>{{current}}</text> -->
				<text v-if="bigcurrent==0">{{i.yztitle}} -->{{i.address}}</text>
				<text v-else>{{i.address}} -->{{i.yztitle}}</text>
			</view>
			<view class="orderitem u-font-36" style="font-weight: bold;" v-if="bigcurrent==0">
				<text>取件码</text>
				<text class="u-m-lr-10">:</text>
				<text class="">{{i.pickupcode}}</text>
			</view>
			<view class="orderitem " >
				<text>订单号</text>
				<text class="u-m-lr-10">:</text>
				<!-- <text>{{current}}</text> -->
				<text class="grey">{{i.ordersn}}</text>
			</view>
			<view class="orderitem">
				<text>客户</text>
				<text class="u-m-lr-10">:</text>
				<!-- <text class="grey">{{bigcurrent}}</text> -->
				<text class="grey">{{i.mobile}}</text>
				
			</view>
			
			<view class="orderitem">
				<text>规格</text>
				<text class="u-m-lr-10">:</text>
				<text class="grey">{{i.type}}</text>
			</view>
			<view class="orderitem">
				<text>备注</text>
				<text class="u-m-lr-10">:</text>
				<text class="grey">{{i.remark}}</text>
			</view>
			<view class="orderitem">
				<text>付款时间</text>
				<text class="u-m-lr-10">:</text>
				<text class="grey">{{i.paytime | date('yyyy-mm-dd hh:MM')}}</text>
			</view>
			
			<view class="orderitem flex" v-if="bigcurrent==1">
				<text style="flex-shrink: 0;">图片：</text>
				<scroll-view scroll-x="true" style="white-space: nowrap;" v-if="bigcurrent==1">
					<image class="u-m-20" style="width: 150rpx; height: 150rpx;" @click="preimg(item)" v-for="item in i.images" :src="$oss(item)"
						></image>
				</scroll-view>
			</view>
			
			<view class="takeorder u-m-r-30 u-m-t-30">
				<text class="takeorder_time u-font-40 " @click="jorder(i.id)" v-if="current==0">
					接单
				</text>
				<view class="u-font-26" v-else-if="current==1">
					<text class="star" @click="starps(i.id,i.status)">
						开始派送
					</text>
					<text class="up u-m-lr-20" @click="updata(i.id)" v-if="i.status==2&&i.xg_status==0">
						提升规格
					</text>
					<text class="up u-m-lr-20"  v-if="i.status==1&&i.xg_status==1">
						补差价中
					</text>
					<text class="up u-m-lr-20"  v-if="i.status==2&&i.xg_status==1">
						已补差价
					</text>
					<text class="cancel" @click="mycancel(i.id)">
						取消订单
					</text>
				</view>
				<view class="u-font-24" v-else-if="current==2">
					<text class="takeorder_time u-m-r-20" @click="finish(i.id)">
						完成配送
					</text>
					<!-- <text class="takeorder_time" >
						正在派送
					</text> -->
				</view>
				
				<text class="takeorder_time u-font-24" v-else>
					已完成
				</text>
			</view>
			<u-line margin='40rpx auto'></u-line>
		</view>
		<u-popup :show="show" mode="center" :round="10" @close="close" @open="open">
			<view class="popbox u-p-20">
				<u-radio-group placement="column" @change="groupChange">
					<u-radio :customStyle="{marginBottom: '18px'}" v-for="(item, index) in radiolist1" :key="index"
						:label="item.name" :name="item.name" @change="radioChange">
					</u-radio>
				</u-radio-group>
				<view class="btn">
					<text class="btn_item" @click="sure">确定</text>
				</view>
			</view>
		</u-popup>

		<u-popup :show="show2" mode="center" :round="10" @close="close2" @open="open2">
			<view class="popbox u-p-20">
				<u-radio-group placement="column" @change="groupChange2">
					<u-radio :customStyle="{marginBottom: '18px'}" v-for="(item, index) in radiolist2" :key="index"
						:label="item.name" :name="item.name" @change="radioChange2">
					</u-radio>
				</u-radio-group>
				<view class="btn">
					<text class="btn_item" @click="sure2">确定</text>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		name: "Delivery",
		// props:{
		// 	current:{
		// 		type:Number,
		// 		default:0
		// 	},
		// 	bigcurrent:{
		// 		type:Number,
		// 		default:0
		// 	}
		// },

		props: ['current', 'bigcurrent','orderlist'],
		// watch:{
		// 	bigcurrent(nval,oval){
		// 		console.log(nval,oval);
		// 	},
		// },
		data() {
			return {
				valuetext: '',
				canceltext: '',
				yztitle: '',
				show: false,
				show2: false,
				radiolist1: [{
						name: '小件',
						disabled: false
					},
					{
						name: '中件',
						disabled: false
					},
					{
						name: '大件',
						disabled: false
					}, {
						name: '超大件',
						disabled: false
					}
				],
				aid:'',
				noclick: true,
				radiolist2: [{
						name: '信息不一致',
						disabled: false
					},
					{
						name: '没有找到',
						disabled: false
					},
					{
						name: '包装破损需要验货',
						disabled: false
					}
				],
			};
		},
		mounted() {
			
			uni.$on('fatherchange',(e)=>{
				console.log(e);
			})
			
		},
		
		methods: {
			preimg(item) {
				uni.previewImage({
					urls: [this.$oss(item)]
				})
			},
			//快递员接单
			jorder(aid){
				this.$api.post('/Delivery/tocourieronorder',{
					aid
				}).then(res=>{
					this.$toast(res.msg)
					uni.$emit('jiedanle',1)
				}).catch(res=>{
					this.$toast(res.msg)
					uni.$emit('jiedanle',1)
				})
			},
			//快递员开始配送
			starps(aid,status){
				if(status==1){
					this.$toast('客户补差价中~')
					return
				}
				this.$api.post('/Delivery/Startdelivery',{
					aid,
					op:this.bigcurrent
				}).then(res=>{
					this.$toast(res.msg)
					uni.$emit('starps',1)
				}).catch(res=>{
					this.$toast(res.msg)
					
				})
			},
			//单个订单完成配送
			finish(id){
				this.$api.post('/Delivery/Oneclickdelivery', {
					op: this.bigcurrent + 1,
					aid:id
				}).then(res => {
					this.$toast(res.msg)
					uni.$emit('arrived', 1)
				})
			},
			open() {
				// console.log('open');
			},
			close() {
				this.show = false
				// console.log('close');
			},
			updata(id) {
				this.aid = id
				this.show = true
			},
			open2() {
				// console.log('open');
			},
			close2() {
				this.show2 = false
				// console.log('close');
			},
			mycancel(id) {
				this.aid  = id
				this.show2 = true
			},
			groupChange(n) {

			},
			radioChange(n) {
				this.valuetext = n
			},
			groupChange2(n) {

			},
			radioChange2(n) {
				this.canceltext = n
			},
			sure() {
				if (this.valuetext) {
					this.$api.post('/Delivery/improvespecifications',{
						aid:this.aid,
						type:this.valuetext
					}).then(res=>{
						this.$toast(res.msg)
						uni.$emit('upgg',1)
					})
					this.show = false
					this.valuetext = ''
				} else {
					this.$toast('请选择你要提升的规格~')
				}
			},
			sure2() {
				
				if (this.canceltext) {
					this.$api.post('/Delivery/deliverycancel',{
						aid:this.aid,
						reason:this.canceltext
					}).then(res=>{
						this.$toast(res.msg)
						uni.$emit('upgg',1)
					})
					this.show2 = false
					this.canceltext = ''
				} else {
					this.$toast('请选择你的原因~')
				}
			},
		}
	}
</script>

<style lang="scss">
	.delivery {
		box-sizing: border-box;
		background-color: rgb(249, 249, 249);
		width: 686rpx;
		margin: 0 auto;

		.grey {
			color: #999;
		}

		.orderitem {
			padding: 10rpx 32rpx;
		}

		.takeorder {
			display: flex;
			justify-content: flex-end;

			.takeorder_time {
				border-radius: 30rpx;
				color: #fff;
				padding: 10rpx 36rpx;
				background-color: rgb(103, 194, 58);
			}

			.star {
				border-radius: 30rpx;
				padding: 10rpx 26rpx;
				color: #67c23a;
				background-color: rgb(240, 249, 235);
				border: 1rpx solid #67c23a;
			}

			.up {
				border-radius: 30rpx;
				padding: 10rpx 26rpx;
				border: 1rpx solid #e6a23c;
				color: #e6a23c;
				background-color: rgb(252, 246, 235);
			}

			.cancel {
				border: 1rpx solid #f56c6c;
				border-radius: 30rpx;
				padding: 10rpx 26rpx;
				color: #f56c6c;
				background-color: rgb(254, 240, 240);
			}
		}
	}

	.popbox {
		width: 600rpx;

		.circle {
			width: 46rpx;
			height: 46rpx;
			border-radius: 50%;
			border: 1rpx solid #000;
		}

		.btn {
			display: flex;
			justify-content: center;
			align-items: center;

			.btn_item {
				padding: 20rpx 100rpx;
				color: #fff;
				background-color: #3861e7;
				border-radius: 30rpx;
			}
		}
	}
</style>